import 'package:blurb/common/routers/names.dart';
import 'package:blurb/common/values/images.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:go_router/go_router.dart';
import 'package:google_fonts/google_fonts.dart';

class LoginGuidePage extends StatelessWidget {
  const LoginGuidePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage(MIP.background),
            fit: BoxFit.cover,
          ),
        ),
        child: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [

              // Blurb 标题
              Padding(
                padding: EdgeInsets.only(top: 20.0.h, left: 30.0.w),
                child: Text(
                  'Blurb',
                  style: GoogleFonts.racingSansOne(
                    color: Colors.white,
                    fontSize: 40.sp,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),

              // 登录提示文本
              Padding(
                padding: EdgeInsets.only(top: 1.0.h, left: 30.0.w),
                child: Text(
                  'Login to your account to continue',
                  style: GoogleFonts.racingSansOne(
                    color: Colors.white,
                    fontSize: 16.sp,
                  ),
                ),
              ),

              // 中间空白区域和应用图标
              Expanded(
                child: Center(
                  child: Image.asset(
                    MIP.logo2,
                    width: 150.w,
                    height: 150.h,
                  ),
                ),
              ),

              // 登录按钮区域
              Padding(
                padding: EdgeInsets.symmetric(
                  horizontal: 30.0.w,
                  vertical: 20.0.h,
                ),
                child: Column(
                  children: [
                    // 普通登录按钮
                    GestureDetector(
                      onTap: () {
                        // 跳转登录页面
                        context.go(RNS.login);
                      },
                      child: Container(
                        width: double.infinity,
                        height: 56.h,
                        decoration: BoxDecoration(
                          gradient: LinearGradient(
                            begin: Alignment(0.50, 0.00),
                            end: Alignment(0.50, 0.96),
                            colors: [
                              const Color(0xFF60C3FF),
                              const Color(0xFFAADEFC),
                            ],
                          ),
                          borderRadius: BorderRadius.circular(13.r),
                        ),
                        child: Center(
                          child: Text(
                            'Existing User Login',
                            style: GoogleFonts.racingSansOne(
                              color: Colors.white,
                              fontSize: 16.sp,
                              fontWeight: FontWeight.normal,
                            ),
                          ),
                        ),
                      ),
                    ),
                    SizedBox(height: 16.h),

                    // Apple登录按钮
                    Container(
                      width: double.infinity,
                      height: 56.h,
                      decoration: BoxDecoration(
                        color: Colors.black,
                        borderRadius: BorderRadius.circular(12.r),
                        border: Border.all(
                          color: Colors.white.withOpacity(0.4),
                        ),
                      ),
                      child: GestureDetector(
                        onTap: () {
                          // Apple登录逻辑
                        },

                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.apple, color: Colors.white, size: 28.sp),
                            SizedBox(width: 8.w),
                            Text(
                              'Continue with Apple',
                              style: GoogleFonts.inter(
                                color: Colors.white,
                                fontSize: 14.sp,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(height: 20.h),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
